<template>
    <div>
        <!--分配人员:ryfp-->
        <el-dialog v-model="dialogVisible" :title="title" width="700" :close-on-press-escape="false" :close-on-click-modal="false" :show-close="false" :before-close="resultData">
            <div class="formBox ryfp">
                <div class="ryfp_form">
                <myform :fields="fields" ref="form1" :rules="rules" :model="model" :options="options"
                    class="m_t_16">
                </myform>
            </div>
            </div>
            <template #footer>
                <div class="dialog-footer">
                    <el-button type="primary" @click="resultData">
                        完成
                    </el-button>
                </div>
            </template>
        </el-dialog>
    </div>
</template>

<script lang='ts'>
import { defineComponent, reactive, toRefs, onBeforeMount,ref} from 'vue'
import {copy} from '../../utils/date'
import {emplLstAll} from '../../api/system/flowPath'
import {ryfpType} from './data'
const model={
    empId:'',
}
export default defineComponent({
    name: '',
    props: {
        title: {
            type: String,
            default: '人员分配',
        }
    },
    setup(props: any, { emit }: any) {
        const data:ryfpType = reactive({
            dialogVisible: true,
            model:copy(model),
            options:{
                empId:[],
            },
            fields:[
                {
                    label: "分配人员",
                    prop: 'empId',
                    placeholder: '请选择分配人员',
                    type: 'select',
                    bindLabel: 'name',
                    bindValue: 'id',
                    labelWidth: '80px'
                },
            ],
            rules: {
                empId: [
                    { required: true, message: '请选择分配人员', trigger: 'blur' },
                ],
            }
        })
        const form1=ref()
        onBeforeMount(() => {
            methods.getData()
        })
        const methods ={
            getData(){
                emplLstAll({}).then((res:any)=>{
                    data.options.empId=res
                })
            },
            resultData(){
                form1.value.verification().then((res) => {
                    emit('resultData',data.model)
                    })
            },
            clearValue(){
                data.model=copy(model)
            }
        }
        return {
            ...toRefs(data),
            ...methods,form1
        }
    }
})
</script>
<style  lang='scss'>
.ryfp_form{
    .el-form-item {
        width: 100% !important;
        .el-form-item__content {
            width: calc(100% - 80px) !important;

            .el-input,
            .el-cascader,
            .el-select {
                width: 100% !important;
            }
        }
    }
    .add{
        width: 20px;
        height: 20px;
        margin: 0px 5px;
    }
    .color{
        cursor: pointer;
        color: rgba(0, 0, 0, 0.4);
    }
}
</style>